<template>
  <div class="">
    <el-table
      :data="tableData"

      style="width: 100%"
      @row-click="tableChange">
      <el-table-column
        prop="index"
        label="序号"
        align="center"
        type="index"
        width="60">
      </el-table-column>

      <el-table-column
        prop="username"
        label="姓名"
        width="120">
      </el-table-column>

      <el-table-column
        prop="department"
        label="工作部门"
        width="120">
      </el-table-column>

      <el-table-column
        prop="position"
        label="现从事岗位"
        width="150">
      </el-table-column>

      <el-table-column
        prop="fteSchoolProfession"
        label="毕业院校及专业"
        >
      </el-table-column>

      <el-table-column
        prop="declareType"
        label="申报类型"
        width="100">
        <template slot-scope="scope">
          <el-tag
            :type="declaretype(scope.row.declareType)[0]"
            disable-transitions>{{declaretype(scope.row.declareType)[1]}}</el-tag>
        </template>
      </el-table-column>

      <el-table-column
        prop="verifyStatus"
        label="申报状态"
        width="100">
        <template slot-scope="scope">
          <el-tag
            :type="verifystatus(scope.row.verifyStatus, scope.row.saveSubmit)[0]"
            disable-transitions>{{verifystatus(scope.row.verifyStatus, scope.row.saveSubmit)[1]}}</el-tag>
        </template>
      </el-table-column>

      <el-table-column
        prop="ctime"
        label="申报时间"
        width="180">
        <template slot-scope="scope">
          {{$formatDateTime(scope.row.ctime)}}
        </template>
      </el-table-column>


      <el-table-column
        label="审核意见"
        width="100"
        @click.stop>
        <template slot-scope="scope">
          <el-popover trigger="hover" placement="top" v-if="scope.row.reason">
            <p>{{scope.row.reason}}</p>
            <div slot="reference" class="name-wrapper" @click.stop>
              <!-- <el-tag size="medium">{{ scope.row.name }}</el-tag> -->
              查看意见
            </div>
          </el-popover>
        </template>
      </el-table-column>
    </el-table>
    <div class="list-page">
      <span>陕西省测绘地理信息行业民营企业专业技术人员初级职称评审暂行办法 -></span>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="pageChange"
        :current-page="currentPage"
        :page-sizes="[15, 20, 30, 50]"
        :page-size="15"
        class="fr"
        layout="sizes, prev, pager, next"
        :total="listtotal">
      </el-pagination>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'jobapp-list',
    title: '申请列表',
    props: {
      offset: {},
      limit: {},
      sort: {},
      order: {},
      data: {},
      total: {}
    },
    data() {
      return {
        tableData: [
          {
            name: '王小虎',
            department: '软件部',
            post: '产品经理',
            profession: '西安电子科技大学计算机科学与技术',
            declaretype: '评审',
            declarstate: '通过',
            declardate: '2016-05-02',
            opinion: '同意'
          }
        ],
        pageSize: 15,
        currentPage : 0,
        listtotal: 0
      }
    },
    mounted () {
      this.pageSize = this.limit
      this.currentPage = this.offset
      this.tableData = this.data
    },
    methods: {
      handleSizeChange(val) {
        this.pageSize = val
        this.$emit('update:limit', val)
      },
      pageChange(val) {
        this.currentPage = val
        this.$emit('update:offset', val)
        this.$emit('update:currentPage', val)
      },
      tableChange (row) {
        this.$emit('selected', row)
        // this.currentRow = val;
      },
      declaretype (str) {
        if (str === 'REVIEW') return ['', '评定']
        else if (str === 'HOLD') return ['success', '认定']
        else if (str === 'UNUSUAL') return ['info', '破格']
      },
      verifystatus (str, str2) {
        if (!str) return ['warning','未提交']
        else if (str === 'WAIT' && str2 === "SAVE") return ['warning','未提交']
        else if (str === 'WAIT' && str2 !== "SAVE") return ['info', '待审核']
        else if (str === 'SUCCESS') return ['success', '已通过']
        else if (str === 'FAIL') return ['danger', '未通过']
      }
    },
    watch: {
      'data' : {
        handler () {
          this.tableData = this.data
        },
        deep: true
      },
      'total' () {
        this.listtotal = this.total
      }
    },
    // computed: {
    //   height () {
    //     let he = this.$store.state.height.client - this.$store.state.height.header - this.$store.state.height.footer - 150
    //     if (he < 300) {
    //       he = 300
    //     }
    //     return he
    //   }
    // }
  }
</script>
<style>
  .list-page {
    line-height: 35px;
  }
  .list-page > span {
    font-size: 13px;
    color: #999999;
  }

</style>
